RxJS (Reactive Extensions for JavaScript) হল একটি লাইব্রেরি যা অ্যাসিনক্রোনাস ডেটা স্ট্রিম এবং ইভেন্ট পরিচালনা করতে সাহায্য করে। এটি Angular অ্যাপ্লিকেশনে ডেটা ফেচিং, সাবস্ক্রিপশন, ইভেন্ট হ্যান্ডলিং, এবং স্ট্রিম প্রক্রেসিংয়ের জন্য ব্যবহৃত হয়। RxJS অপারেটরগুলি আমাদের ডেটা স্ট্রিমগুলিকে ট্রান্সফর্ম, ফিল্টার, এবং কম্পোজ করতে সাহায্য করে। এখানে আমরা কিছু সাধারণ RxJS অপারেটরগুলির ব্যাখ্যা এবং ব্যবহার দেখব যেমন map, filter, mergeMap, concatMap, switchMap ইত্যাদি।

১. map অপারেটর

map অপারেটরটি ইনপুট ভ্যালুর উপর কোন ট্রান্সফর্মেশন বা রূপান্তর প্রয়োগ করে এবং একটি নতুন ভ্যালু রিটার্ন করে।

ব্যবহার:

import { of } from 'rxjs';
import { map } from 'rxjs/operators';

const source$ = of(1, 2, 3, 4);
const mapped$ = source$.pipe(map(value => value * 2));

mapped$.subscribe(value => console.log(value));  // Output: 2, 4, 6, 8

এখানে, map অপারেটরটি প্রতিটি ইনপুট ভ্যালুর উপর *2 অপারেশন প্রয়োগ করছে।

২. filter অপারেটর

filter অপারেটরটি শুধুমাত্র সেই ভ্যালুগুলিকে পাস করে যেগুলি একটি নির্দিষ্ট শর্তে খাপ খায়। এটি স্ট্রিমের ডেটাকে ফিল্টার করতে ব্যবহৃত হয়।

ব্যবহার:

import { of } from 'rxjs';
import { filter } from 'rxjs/operators';

const source$ = of(1, 2, 3, 4, 5);
const filtered$ = source$.pipe(filter(value => value % 2 === 0));

filtered$.subscribe(value => console.log(value));  // Output: 2, 4

এখানে, filter অপারেটরটি শুধু এমন ভ্যালু পাস করবে যেগুলি even (যুগল সংখ্যা)।

৩. mergeMap অপারেটর

mergeMap অপারেটরটি ইনপুট স্ট্রিমের প্রতিটি ভ্যালুতে একটি নতুন Observable রিটার্ন করে এবং সমস্ত Observable কে একত্রে মর্জ (merge) করে। এটি একাধিক সাবস্ক্রিপশন তৈরি করে, ফলে এটি বিভিন্ন অ্যাসিনক্রোনাস অপারেশনের ফলাফল একসাথে পেতে সাহায্য করে।

ব্যবহার:

import { of } from 'rxjs';
import { mergeMap } from 'rxjs/operators';

const source$ = of(1, 2, 3);
const merged$ = source$.pipe(
  mergeMap(value => of(value * 10))  // প্রতিটি ভ্যালুর জন্য একটি নতুন Observable
);

merged$.subscribe(value => console.log(value));  // Output: 10, 20, 30

এখানে, mergeMap প্রতিটি ইনপুট ভ্যালুর জন্য একটি নতুন Observable তৈরি করে এবং সমস্ত ফলাফল একসাথে রিটার্ন করে।

৪. concatMap অপারেটর

concatMap অপারেটরটি একে একে (sequentially) একাধিক Observable এক্সিকিউট করতে ব্যবহৃত হয়। এটি এক সময়ে একটি ইনপুট Observable-কে প্রক্রিয়া করবে এবং পরবর্তী Observable ততক্ষণে শুরু হবে না যতক্ষণ না প্রথমটি শেষ হয়।

ব্যবহার:

import { of } from 'rxjs';
import { concatMap } from 'rxjs/operators';

const source$ = of(1, 2, 3);
const concatMapped$ = source$.pipe(
  concatMap(value => of(value * 10))
);

concatMapped$.subscribe(value => console.log(value));  // Output: 10, 20, 30

এখানে, concatMap প্রতিটি ভ্যালু ইনপুট স্ট্রিমের পর sequentially প্রসেস করবে।

৫. switchMap অপারেটর

switchMap অপারেটরটি একটি নতুন Observable রিটার্ন করে এবং আগের Observable-কে সাবস্ক্রাইব করতে বাধা দেয়। যদি একটি নতুন ইনপুট আসা হয়, এটি পুরোনো Observable কে ক্যান্সেল করে এবং নতুন Observable এর সাথে কাজ শুরু করে।

ব্যবহার:

import { of } from 'rxjs';
import { switchMap } from 'rxjs/operators';

const source$ = of('A', 'B', 'C');
const switched$ = source$.pipe(
  switchMap(value => of(value + ' processed'))
);

switched$.subscribe(value => console.log(value));  // Output: 'A processed', 'B processed', 'C processed'

এখানে, switchMap প্রতিটি নতুন ইনপুট আসলে আগের Observable-কে ক্যান্সেল করে নতুন Observable-কে প্রসেস করবে।

৬. debounceTime অপারেটর

debounceTime অপারেটরটি ইনপুট স্ট্রিমে ডিলে (delay) করে। এটি ডেটার ফ্লাকচুয়েশন কমাতে বা অতিরিক্ত API কল এড়াতে ব্যবহৃত হয়। উদাহরণস্বরূপ, যখন একজন ব্যবহারকারী ইনপুট ফিল্ডে টাইপ করছে, তখন প্রতিটি টাইপের পরে API কল না হয়ে একটি নির্দিষ্ট সময় পর কল করা হয়।

ব্যবহার:

import { of } from 'rxjs';
import { debounceTime } from 'rxjs/operators';

const source$ = of('hello', 'hi', 'how are you');
const debounced$ = source$.pipe(
  debounceTime(1000)  // 1 সেকেন্ড ডিলে
);

debounced$.subscribe(value => console.log(value)); 

এখানে, debounceTime অপারেটরটি ইনপুটের মধ্যে ১ সেকেন্ড ডিলে যুক্ত করবে।

৭. distinctUntilChanged অপারেটর

distinctUntilChanged অপারেটরটি শুধুমাত্র সেই ভ্যালুগুলোকে পাস করবে যেগুলি পূর্ববর্তী ভ্যালুর সাথে আলাদা। এটি ডুপ্লিকেট ইনপুট এড়াতে ব্যবহৃত হয়।

ব্যবহার:

import { of } from 'rxjs';
import { distinctUntilChanged } from 'rxjs/operators';

const source$ = of(1, 1, 2, 3, 3, 4, 5);
const distinct$ = source$.pipe(
  distinctUntilChanged()  // পূর্ববর্তী ভ্যালুর সাথে মিল না হলে পাস করবে
);

distinct$.subscribe(value => console.log(value));  // Output: 1, 2, 3, 4, 5

এখানে, distinctUntilChanged একই মানের পুনরাবৃত্তি এড়াবে।

উপসংহার

RxJS অপারেটরগুলো Angular অ্যাপ্লিকেশনে ডেটা স্ট্রিম হ্যান্ডলিং এবং অ্যাসিনক্রোনাস অপারেশনগুলো সহজ করে। এর মাধ্যমে আপনি ডেটাকে ট্রান্সফর্ম, ফিল্টার, এবং ম্যানিপুলেট করতে পারেন। map, filter, mergeMap, concatMap, switchMap, debounceTime, distinctUntilChanged ইত্যাদি অপারেটরগুলি সাধারণত ব্যবহৃত হয়। এগুলির দক্ষ ব্যবহার অ্যাঙ্গুলার অ্যাপ্লিকেশনগুলোতে শক্তিশালী এবং কার্যকর ডেটা ফ্লো তৈরি করতে সাহায্য করে।